<link rel="stylesheet" href="__STATIC_LIB__layuiadmin/layui/layui_ext/dtree/dtree.css">
<link rel="stylesheet" href="__STATIC_LIB__layuiadmin/layui/layui_ext/dtree/font/dtreefont.css">

<form class="layui-form  seller-alone-form" id="userEdit" style="padding: 20px;">
    
    <div class="layui-form-item">
        <input type="hidden" name="id" value="{$info.id}">
        <div class="layui-inline">
            <label class="layui-form-label"><i class="required-color">*</i>手机号：</label> 
            <div class="layui-input-inline">
                <input type="text" name="mobile" class="layui-input" value="{$info.mobile}"> 
            </div>
        </div> 
        <div class="layui-inline">
            <label class="layui-form-label"><i class="required-color">*</i>姓名：</label>
            <div class="layui-input-inline">
                <input type="text" name="truename" class="layui-input" value="{$info.truename}">
            </div>
        </div>
    </div> 
    <div class="layui-form-item">
        <div class="layui-inline">
            <label class="layui-form-label"><i class="required-color">*</i>密码：</label> 
            <div class="layui-input-inline">
                <input type="password" name="password" id="password" readonly="readonly" class="layui-input"
                    placeholder="为空时不修改密码">
            </div>
        </div>
        <div class="layui-inline">
            <label class="layui-form-label"><i class="required-color">*</i>确认密码：</label> 
            <div class="layui-input-inline">
                <input type="password" name="repassword" id="repassword" readonly="readonly" class="layui-input"
                    placeholder="请与密码保持一致">
            </div>
        </div>
    </div> 
    <div class="layui-form-item">
        <div class="layui-inline">
            <label class="layui-form-label"><i class="required-color">*</i>部门：</label>
            <div class="layui-input-inline" style="width: 514px;">
                <tree id="deptTree" class="dtree" data-id="0" ></tree>
            </div>
        </div> 
    </div>
    <div class="layui-form-item">
        <div class="layui-inline">
            <label class="layui-form-label"><i class="required-color">*</i>职位：</label>
            <div class="layui-input-inline">
                <select name="position" id="position" lay-verify="required">
                    {volist name='posList' id='vo'}
                        <option value="{$vo.id}" {eq name="$info.positionName" value="$vo.name"}selected{/eq}>{$vo.name}</option>
                    {/volist}
                </select>
            </div>
        </div>
        <div class="layui-inline">
            <label class="layui-form-label"><i class="required-color">*</i>状态：</label>

            <div class="layui-input-inline">
                <select name="status" id="status">
                    <option value="1" {if $info.state=='1' }selected="selected" {/if}>正常 </option>
                    <option value="2" {if $info.state=='2' }selected="selected" {/if}>停用 </option>
                </select> 
            </div> 
        </div>
    </div> 
    <div class="layui-form-item"> 
        <div class="layui-inline">
            <label class="layui-form-label">生日：</label>
            <div class="layui-input-inline">
                <input type="text" name="birthday" id="birthday" class="layui-input" value="{$info.birthday}">
            </div>
        </div>
        <div class="layui-inline">
            <label class="layui-form-label">昵称：</label>

            <div class="layui-input-inline">
                <input type="text" name="nickname" id="nickname" readonly="readonly" class="layui-input"
                    value="{$info.nickname}">
            </div>
        </div>
    </div>
    <div class="layui-form-item">
        <div class="layui-inline">
            <label class="layui-form-label"><i class="required-color">*</i>性别：</label>

            <div class="layui-input-inline">
                <input type="radio" name="sex" value="1" title="男" {if $info.sex==1}checked="checked" {/if}> <input
                    type="radio" name="sex" value="2" title="女" {if $info.sex==2}checked="checked" {/if}> </div> </div>
                    <div class="layui-inline">
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label">头像：</label>

                <div class="layui-input-inline">
                    {ZlServer:image id="avatar" name="avatar" value="$info.avatar"}
                </div>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">角色：</label>
            <div class="layui-input-inline" style= 'width:600px; padding-bottom: 20px;'>
                {volist name="roleList" id="vo"}
                    <input type="checkbox" name="role_id[{$vo.id}]" lay-skin="primary" title="{$vo.name}" {if isset($vo['checked']) && $vo['checked']}checked=""{/if} >
                {/volist}
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-input-block">
                <input type="hidden" name="open_spec" value="0">
                {:zlserverToken()}
                <button id="user_edit_save" class="layui-btn" lay-submit="" lay-filter="save">保存</button>
            </div>
        </div>
        {:zlserverToken()}
</form>
<script>
    layui.extend({
        dtree: '__STATIC_LIB__layuiadmin/layui/layui_ext/dtree/dtree'
    }).use(['form', 'laydate', 'dtree'], function () { 
        var form = layui.form, laydate = layui.laydate, dtree = layui.dtree;
        form.render();

        laydate.render({
            elem: '#birthday'
        });

        var deptTree = dtree.renderSelect({
            elem: "#deptTree",
            url: '{:url("Dept/getList")}',
            selectTips: "请选择部门",
            menubar: true, //开启菜单栏
            checkbar: false,
            width: "100%", // 指定树的宽度
            response:{message:"msg",statusCode:0},
            dataStyle: "layuiStyle",
            done: function(res, $ul, first){
                dtree.selectVal("deptTree", "{$info.deptId}"); 
            }
        });

        setTimeout(function removeReadonly() {
            var name = document.getElementById("nickname");
            var password = document.getElementById("password");
            var repassword = document.getElementById("repassword");
 
            name.removeAttribute("readonly");
            password.removeAttribute("readonly");
            repassword.removeAttribute("readonly");
        }, 20);

        //保存用户
        form.on('submit(save)', function (data) {
            formData = data.field;
            if (!formData) {
                layer.msg('请先完善数据', { time: 1300 });
                return false;
            }

            $("#user_edit_save").addClass("layui-btn-disabled");
            $('#user_edit_save').attr("disabled", true);

            $.ajax({
                type: 'post',
                url: '{:url("User/editUser")}',
                data: formData,
                dataType: 'json',
                success: function (e) {
                    if (e.status === true) {
                        layer.open({
                            type: 1
                            , offset: 'auto'
                            , id: 'layerDemoAuto'
                            , content: '<div style="padding: 20px 100px;">' + e.msg + '</div>'
                            , btn: '关闭'
                            , btnAlign: 'c' //按钮居中
                            , shade: 0.3 //不显示遮罩
                            , yes: function () {
                                parent.layui.admin.events.changeTabAndRefresh('/manage/user/index.html', 'userTable');
                            }, close: function () {
                                console.log('close');
                            }, end: function () {
                                parent.layui.admin.events.changeTabAndRefresh('/manage/user/index.html', 'userTable');
                            }
                        });
                    } else {
                        $("#user_edit_save").removeClass("layui-btn-disabled");
                        $('#user_edit_save').removeAttr("disabled");

                        layer.msg(e.msg, { time: 1300 });
                    }
                }
            });
            return false;
        });
    });
</script>